<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title></title>
    <link rel="stylesheet" href="css/base.css"/>
    <link rel="stylesheet" href="css/reset.css"/>
</head>
<body>
<header class="base-header">
    <section class="topbar">
        <div class="container">
            <div class="login">
                <span><a href="#" class="loginbtn">登 录</a></span>
                <span><a href="#" class="loleft">注 册</a></span>
            </div>
            <div class="cart">
                <a href="#" class="cartbtnleft ">
                    <span class="count">2</span>
                    <span class="chrs"> 购 物 车</span>
                </a>
                <a href="#"  class="cartbtnmore"></a>
            </div>
        </div>
    </section>
    <section class="logosearch">
        <div class="container">
            <h1 class="logo">
                <a href="#">图书馆—首页</a>
            </h1>
            <div class="search">
                <input class="inputsearch" type="text " placeholder="请输入关键字" >
                <button class="searchbtn">
                    <span class="srearchicon"></span>
                </button>
            </div>

        </div>
    </section>
    <nav>
        <div class="menu">
            <div class="container">
                <ul class="menulist">
                    <li class="current"><a href="#">图书</a></li>
                    <li><a href="#">电子书</a></li>
                    <li><a href="#">有声读物</a></li>
                    <li><a href="#">DVD</a></li>
                    <li><a href="#">音乐</a></li>
                    <li><a href="#">礼品</a></li>
                </ul>
            </div>
        </div>
        <div class="submenu">
            <div class="container">
                <ul class="submenulist">
                    <li><a href="#">小说</a></li>
                    <li><a href="#">非小说</a></li>
                    <li><a href="#">儿童读物</a></li>
                    <li><a href="#">流行</a></li>
                    <li><a href="#">畅销榜</a></li>
                </ul>
            </div>
        </div>
    </nav>
</header>
<section class="index-new">
    <div class="container">
        <div class="besetop">
            <h3>
            <span>首页</span><span>  >   小说</span><span>>    经典小说</span>
            </h3>
        </div>
        <div class="bestbottom">
            <div class="bestbtnleft ">
                <div class="lefttop">
                    <h2 class="re" >Browse Categories</h2>
                    <ul>
                        <li>Fiction & related items</li>
                        <li class="fic"><span class="on"></span>Classic fiction</li>
                        <li>Non-Fiction</li>
                        <li>Children's</li>
                    </ul>
                </div>
                <div class="leftbottom">
                    <ul>
                        <h2 class="re flo">Refine By:<a href="#">clear all</a></h2>
                    </ul>
                    <ul>
                        <h2>Promotion:<a href="#">clear</a></h2>
                        <form>
                            <li>
                                <input class="text"type="checkbox" name="vehicle" value="Bike">    On Sale
                                <span class="chrs" >(339)</span>
                            </li>
                        </form>
                    </ul>
                    <ul>
                        <h2>Format:<a href="#">clear</a></h2>
                        <form>
                            <li>
                                <input class="text"type="checkbox" name="vehicle" value="Bike">     CD-Audio
                                <span class="chrs" >(611)</span>
                            </li>
                            <li>
                                <input type="checkbox" name="vehicle" value="Bike">      CD-Extra
                                <span class="chrs" >(8)</span>
                            </li>
                            <li>
                                <input type="checkbox" name="vehicle" value="Bike">    Audio
                                <span class="chrs" >(3)</span>
                            </li>
                            <li>
                                <input type="checkbox" name="vehicle" value="Bike">Pre-recorded digital audio player
                                <span class="chrs dig" >(3)</span>
                            </li>
                            <li>
                                <input type="checkbox" name="vehicle" value="Bike">   Audio disc
                                <span class="chrs" >(1)</span>
                            </li>
                        </form>
                    </ul>
                    <ul>
                        <h2>Availability:<a href="#">clear</a></h2>
                        <form>
                            <li>
                                <input type="checkbox" name="vehicle" value="Bike">   2-4 Day Delivery
                                <span class="chrs" >(21)</span>
                            </li>
                            <li>
                                <input type="checkbox" name="vehicle" value="Bike">   In Stock with Supplier
                                <span class="chrs" >(579)</span>
                            </li>
                            <li>
                                <input type="checkbox" name="vehicle" value="Bike">   Backorder
                                <span class="chrs" >(490)</span>
                            </li>
                            <li>
                                <input type="checkbox" name="vehicle" value="Bike">   Pre-order
                                <span class="chrs" >(23)</span>
                            </li>
                            <li>
                                <input type="checkbox" name="vehicle" value="Bike">   Out of stock
                                <span class="chrs" >(1,998)</span>
                            </li>
                        </form>
                    </ul>
                    <ul>
                        <h2>Price:</h2>
                        <form>
                            <li>
                                <input type="radio" name="sex" value="male">   All<br>
                            </li>
                            <li>
                                <input type="radio" name="sex" value="male">   Under $20<br>
                            </li>
                            <li>
                                <input type="radio" name="sex" value="male">   $20 - $40<br>
                            </li>
                            <li>
                                <input type="radio" name="sex" value="male">   $40 +
                            </li>
                        </form>
                    </ul>
                </div>
            </div>
            <div class="bestbtnright">
                <div class="booktop">
                    <h1>经典小说</h1>
                    <ul>
                        <li><a href="#">1</a></li>
                        <li><a href="#">2</a></li>
                        <li><a href="#">3</a></li>
                        <li><a href="#">4</a></li>
                        <li><a href="#">5</a></li>
                        <li><a href="#">...</a></li>
                        <li><a href="#">32</a></li>
                        <li><a href="#"> ></a></li>
                    </ul>
                </div>
                <div class="bookbtn">
                    <ul class="newlist">
                        <li class="post">
                            <a href="#" class="img">
                                <img src="image/new1.png" alt="">
                            </a>
                            <span class="title">Of Mice and Men</span>
                            <span class="author">by John Steinbeck</span>
                            <span class="data"><span class="zone"><span class="icon"></span>&nbsp;   In Stock | 2-4 Days</span></span>
                            <span class="cover">CD-Audio</span>
                            <span class="oldprice">RRP $39.99</span>
                            <span class="nowprice">$24.06</span>
                            <span class="off">
                              <span class="percent">39%</span>
                              <span class="offchr">OFF</span>
                          </span>
                            <a href="#" class="button">
                                <span class="left">Buy Now</span>
                                <span class="icon"></span>
                            </a>
                        </li>
                        <li class="pre">
                            <a href="#" class="img">
                                <img src="image/new2.png " alt="">
                            </a>
                            <span class="title">Finding You</span>
                            <span class="author">by Jo Watson</span>
                            <span class="data"><span class="zone"><span class="icon"></span>&nbsp;24/08/2017</span></span>
                            <span class="cover">Paperback / Softback</span>
                            <span class="oldprice">RRP $18.99</span>
                            <span class="nowprice">$16.14</span>
                            <span class="off">
                              <span class="percent">15%</span>
                              <span class="offchr">OFF</span>
                          </span>
                            <a href="#" class="button">
                                <span class="left">Pre-Order</span>
                                <span class="icon"></span>
                            </a>
                        </li>
                        <li class="post">
                            <a href="#" class="img">
                                <img src="image/new3.png " alt="">
                            </a>
                            <span class="title">Journey to the Center of the Earth</span>
                            <span class="author">by Jules Verne</span>
                            <span class="data"><span class="zone"><span class="icon"></span>&nbsp;   In Stock | 2-4 Days</span></span>
                            <span class="cover">CD-Audio</span>
                            <span class="oldprice">RRP $19.99</span>
                            <span class="nowprice">$14.25</span>
                            <span class="off">
                              <span class="percent">28%</span>
                              <span class="offchr">OFF</span>
                          </span>
                            <a href="#" class="button">
                                <span class="left">Buy Now</span>
                                <span class="icon"></span>
                            </a>
                        </li>
                        <li class="post">
                            <a href="#" class="img">
                                <img src="image/new4.png " alt="">
                            </a>
                            <span class="title">The Middle Parts Of Fortune</span>
                            <span class="author">by Frederic Manning</span>
                            <span class="data"><span class="zone"><span class="icon"></span>&nbsp;   In Stock | 2-4 Days</span></span>
                            <span class="cover">CD-Audio</span>
                            <span class="oldprice">RRP $18.95</span>
                            <span class="nowprice">$15.80</span>
                            <span class="off">
                              <span class="percent">16%</span>
                              <span class="offchr">OFF</span>
                          </span>
                            <a href="#" class="button">
                                <span class="left">Buy Now</span>
                                <span class="icon"></span>
                            </a>
                        </li>
                        <li class="post">
                            <a href="#" class="img">
                                <img src="image/new5.png " alt="">
                            </a>
                            <span class="title">My Brilliant Career</span>
                            <span class="author">by Miles Franklin</span>
                            <span class="data"><span class="zone"><span class="icon"></span>&nbsp;   In Stock | 2-4 Days</span></span>
                            <span class="cover">CD-Audio</span>
                            <span class="oldprice">RRP $18.95</span>
                            <span class="nowprice">$15.80</span>
                            <span class="off">
                              <span class="percent">16%</span>
                              <span class="offchr">OFF</span>
                          </span>
                            <a href="#" class="button">
                                <span class="left">Buy Now</span>
                                <span class="icon"></span>
                            </a>
                        </li>
                        <li class="post">
                            <a href="#" class="img">
                                <img src="image/new6.png" alt="">
                            </a>
                            <span class="title">To Kill A Mockingbird 50th Anniversary Edition</span>
                            <span class="author">by Harper Lee</span>
                            <span class="data"><span class="zone"><span class="icon"></span>&nbsp;   In Stock | 2-4 Days</span></span>
                            <span class="cover">CD-Audio</span>
                            <span class="oldprice">RRP $60.00</span>
                            <span class="nowprice">$38.74</span>
                            <span class="off">
                              <span class="percent">35%</span>
                              <span class="offchr">OFF</span>
                          </span>
                            <a href="#" class="button">
                                <span class="left">Buy Now</span>
                                <span class="icon"></span>
                            </a>
                        </li>
                        <li class="post">
                            <a href="#" class="img">
                                <img src="image/new3.png" alt="">
                            </a>
                            <span class="title">Moby Dick</span>
                            <span class="author">by Herman Melville</span>
                            <span class="data"><span class="zone"><span class="icon"></span>&nbsp;   In Stock | 2-4 Days</span></span>
                            <span class="cover">CD-Audio</span>
                            <span class="oldprice">RRP $19.99</span>
                            <span class="nowprice">$16.99</span>
                            <span class="off">
                              <span class="percent">15%</span>
                              <span class="offchr">OFF</span>
                          </span>
                            <a href="#" class="button">
                                <span class="left">Buy Now</span>
                                <span class="icon"></span>
                            </a>
                        </li>
                        <li class="post">
                            <a href="#" class="img">
                                <img src="image/new8.png" alt="">
                            </a>
                            <span class="title">War and Peace Classic Collection</span>
                            <span class="author">by Frederick Davidson and</span>
                            <span class="data"><span class="zone"><span class="icon"></span>&nbsp;   In Stock | 2-4 Days</span></span>
                            <span class="cover">CD-Audio</span>
                            <span class="oldprice">RRP $120.00</span>
                            <span class="nowprice">$102.00</span>
                            <span class="off">
                              <span class="percent">15%</span>
                              <span class="offchr">OFF</span>
                          </span>
                            <a href="#" class="button">
                                <span class="left">Buy Now</span>
                                <span class="icon"></span>
                            </a>
                        </li>
                        <li class="post">
                            <a href="#" class="img">
                                <img src="image/new9.png" alt="">
                            </a>
                            <span class="title">Emma</span>
                            <span class="author">by Jane Austen</span>
                            <span class="data"><span class="zone"><span class="icon"></span>&nbsp;   In Stock | 2-4 Days</span></span>
                            <span class="cover">CD-Audio</span>
                            <span class="oldprice">RRP $29.99</span>
                            <span class="nowprice">$25.49</span>
                            <span class="off">
                              <span class="percent">15%</span>
                              <span class="offchr">OFF</span>
                          </span>
                            <a href="#" class="button">
                                <span class="left">Buy Now</span>
                                <span class="icon"></span>
                            </a>
                        </li>
                        <li class="post">
                            <a href="#" class="img">
                                <img src="image/new10.png" alt="">
                            </a>
                            <span class="title">Henry Lawson:A Selection a Selection</span>
                            <span class="author">by Henry Lawson</span>
                            <span class="data"><span class="zone"><span class="icon"></span>&nbsp;   In Stock | 2-4 Days</span></span>
                            <span class="cover">CD-Extra</span>
                            <span class="oldprice">RRP $24.95</span>
                            <span class="nowprice">$20.12</span>
                            <span class="off">
                              <span class="percent">19%</span>
                              <span class="offchr">OFF</span>
                            </span>
                            <a href="#" class="button">
                                <span class="left">Buy Now</span>
                                <span class="icon"></span>
                            </a>
                        </li>
                        <li class="post">
                            <a href="#" class="img">
                                <img src="image/new10.png" alt="">
                            </a>
                            <span class="title">Henry Lawson:A Selection a Selection</span>
                            <span class="author">by Henry Lawson</span>
                            <span class="data"><span class="zone"><span class="icon"></span>&nbsp;   In Stock | 2-4 Days</span></span>
                            <span class="cover">CD-Audio</span>
                            <span class="oldprice">RRP $29.95</span>
                            <span class="nowprice">$24.16</span>
                            <span class="off">
                              <span class="percent">19%</span>
                              <span class="offchr">OFF</span>
                            </span>
                            <a href="#" class="button">
                                <span class="left">Buy Now</span>
                                <span class="icon"></span>
                            </a>
                        </li>
                        <li class="post">
                            <a href="#" class="img">
                                <img src="image/new12.png" alt="">
                            </a>
                            <span class="title">Winnie-The-Pooh Boxed Set Winnie-The-Pooh;</span>
                            <span class="author">by A A Milne</span>
                            <span class="data"><span class="zone"><span class="icon"></span>&nbsp;   In Stock | 2-4 Days</span></span>
                            <span class="cover">CD-Audio</span>
                            <span class="oldprice">RRP $49.95</span>
                            <span class="nowprice">$32.64</span>
                            <span class="off">
                              <span class="percent">34%</span>
                              <span class="offchr">OFF</span>
                          </span>
                            <a href="#" class="button">
                                <span class="left">Buy Now</span>
                                <span class="icon"></span>
                            </a>
                        </li>

                    </ul>
                </div>
                <div class="bookfoot">
                    <ul>
                        <li><a href="#">1</a></li>
                        <li><a href="#">2</a></li>
                        <li><a href="#">3</a></li>
                        <li><a href="#">4</a></li>
                        <li><a href="#">5</a></li>
                        <li><a href="#">...</a></li>
                        <li><a href="#">32</a></li>
                        <li><a href="#"> ></a></li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</section>
<footer class="base-footer">
    <div class="footertop">
        <div class="container">
            <div class="left">
                <div class="help">
                    <h3><span class="ic"></span>帮助</h3>
                    <ul class="helplist">
                        <li><a href="#">我的订单</a></li>
                        <li><a href="#">物流信息</a></li>
                        <li><a href="#">退货政策</a></li>
                        <li><a href="#">意见反馈</a></li>
                    </ul>
                </div>
                <div class="tel">
                    <ul class="tellist">
                        <li><a href="#"><span class="tele"></span>400-111-0000</a></li>
                    </ul>
                </div>
            </div>
            <div class="right">
                <ul class="footernavtoplist">
                    <li>
                        <h3>关于我们</h3>
                        <ul>
                            <li><a href="#">公司历史</a></li>
                            <li><a href="#">联系我们</a></li>
                            <li><a href="#">媒体关注</a></li>
                            <li><a href="#">合作伙伴</a></li>
                            <li><a href="#">移动站点</a></li>
                        </ul>
                    </li>
                    <li>
                        <h3>关注我们</h3>
                        <ul>
                            <li><a href="#">公司历史</a></li>
                            <li><a href="#">报纸媒体</a></li>
                            <li><a href="#">Facebook</a></li>
                            <li><a href="#">YouTube</a></li>
                            <li><a href="#">Twitter</a></li>
                        </ul>
                    </li>
                </ul>
                <ul class="footernavbtmlist">
                    <li>
                        <h3>社交网络</h3>
                        <ul class="social ibp">
                            <li class="fb"><a href="#"></a></li>
                            <li class="yt"><a href="#"></a></li>
                            <li class="twitter"><a href="#"></a></li>
                            <li class="wb"><a href="#"></a></li>
                            <li class="qq" ><a href="#"></a></li>
                            <li class="gp" ><a href="#"></a></li>
                        </ul>
                    </li>
                    <li >
                        <h3>支付方式</h3>
                        <ul class="payment ibp" >
                            <li class="visa" ><a href="#"></a></li>
                            <li class="master" ><a href="#"></a></li>
                            <li class="qpay" ><a href="#"></a></li>
                            <li class="wepay" ><a href="#"></a></li>
                        </ul>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <div class="footerbottom">
        <div class="container">
            <div class="footerbtmleft"></div>
            <div class="copyright">
                版权所有  2017.<br>
                <a href="#">隐私政策</a>&nbsp;     |
                <a href="#">&nbsp;   使用条款</a>&nbsp;    |
                <a href="">&nbsp;   内容政策</a>

            </div>
        </div>
    </div>
</footer>

</body>
</html>